<script setup>
import FirstTitle from "@comp/FirstTitle";
import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
import { onMounted } from "vue";
import { searchDataPzzh } from "@/api/search";
import { addOrUpdatePzzh } from "@/api/addOrUpdate";
import { postTableData } from "@/api/table";
import {
  dlList,
  gsList,
  rqList,
  dqList,
  jzList,
  grList,
  jhList,
  jyList,
  txList,
  ysList,
  xxList,
  xlList,
  hhList,
  wzList,
  gcList
} from "@/data/pzzh";

const city = window.globalObj.name;
const editorRef = shallowRef();
const editorRef1 = shallowRef();
const editorRef2 = shallowRef();
const editorRef3 = shallowRef();
const editorRef4 = shallowRef();
const editorRef5 = shallowRef();
const editorRef6 = shallowRef();

const toolbarConfig = {};
const toolbarConfig1 = {};
const toolbarConfig2 = {};
const toolbarConfig3 = {};
const toolbarConfig4 = {};
const toolbarConfig5 = {};
const toolbarConfig6 = {};

const editorConfig = {
  placeholder: "请输入内容...",
};
const mode = ref("default");
const mode1 = ref("default");
const mode2 = ref("default");
const mode4 = ref("default");
const mode5 = ref("default");
const mode6 = ref("default");

// 加载html
const initHtml = () => {
  searchDataPzzh({ m: "相关保障" }).then((res) => {
    const { data } = res;
    valueHtml.value = data.find((x) => x.k === "专业力量扩编保障要点")?.v || "";
    valueHtml1.value = data.find((x) => x.k === "装备器材保障要点")?.v || "";
    valueHtml2.value = data.find((x) => x.k === "生活物资经费保障")?.v || "";
    valueHtml3.value = data.find((x) => x.k === "救灾物资经费保障")?.v || "";
    valueHtml4.value = data.find((x) => x.k === "工程物资经费保障")?.v || "";
    valueHtml5.value = data.find((x) => x.k === "信息通信保障要点")?.v || "";
    valueHtml6.value = data.find((x) => x.k === "卫生防疫保障要点")?.v || "";
  });
};

const handleCreated = (editor) => {
  editorRef.value = editor; // 记录 editor 实例，重要！
};
const handleCreated1 = (editor) => {
  editorRef1.value = editor; // 记录 editor 实例，重要！
};
const handleCreated2 = (editor) => {
  editorRef2.value = editor; // 记录 editor 实例，重要！
};
const handleCreated3 = (editor) => {
  editorRef3.value = editor; // 记录 editor 实例，重要！
};
const handleCreated4 = (editor) => {
  editorRef4.value = editor; // 记录 editor 实例，重要！
};
const handleCreated5 = (editor) => {
  editorRef5.value = editor; // 记录 editor 实例，重要！
};
const handleCreated6 = (editor) => {
  editorRef6.value = editor; // 记录 editor 实例，重要！
};

const valueHtml = ref(
  "&nbsp;&nbsp;保障任务：战时市级完成重要目标、供水、供电、燃气、供热、道桥、工程抢险抢修队伍，消防、医疗救护、防化防疫、治安、交通运输、通信、信息防护和伪装防护等XX类专业队伍扩编任务，每支专业队扩编后配备XX套基本装备器材和物资。各县（区）专业力量扩编，结合实际按需组建各类专业队，至少配备XX套基本装备器材和物资。<br/> &nbsp;&nbsp;保障方法：扩编专业队的人员由各组建牵头单位负责协调抽组专业人员编组，尽可能成建制抽组；扩编专业队的装备器材、物资经费以组建单位保障为主，不足部分可申请上级调拨补充或专项经费补助，保障标准参照“装备器材和物资经费保障要点。"
);
const valueHtml1 = ref(
  "&nbsp;&nbsp;保障任务：保障各种工程平战转换使用的装备器材；筹措补充、调配发放各专业队的装备器材。<br/>&nbsp;&nbsp;保障方法：各种工程平战转换使用的装备器材，由工程建设单位或工程使用管理单位自行保障；扩编专业队的装备器材以组建单位保障为主，不足部分可申请上级调拨补充。<br/>&nbsp;&nbsp;保障标准：各专业队按战时扩编XX倍,保障每个专业队配齐XX套专业装备器材。"
);
const valueHtml2 = ref(
  "&nbsp;&nbsp;保障任务：主要负责平战转换工作使用和战储生活物资采购、存储、调配、发放，以及经费筹措、使用管理。<br/>&nbsp;&nbsp;保障方法：平战转换工作使用的生活物资，由各工程建设单位或工程使用管理单位自行保障；战储生活物资采取以政府储备为主，政府储备与企业代储、生产能力储备和家庭储备相结合的方式保障，建立市、县（区）两级储备。<br/>&nbsp;&nbsp;物资经费来源：主要由本级人民政府、本单位保障，不足部分申请上级保障。<br/>&nbsp;&nbsp;战储保障人口规模：按城市人口XX%计算。某某市人口XX万、某某区人口XX万、某某区人口XX万、龙某某区人口XX万、某某区人口XX万、某某区人口XX万、某某县人口XX万、某某县人口XX万、某某县人口XX万、某某县人口XX万。<br/>&nbsp;&nbsp;单种商品战储计算标准：米按人日均XXkg,可保障XX天计算。面按人日均XXkg,可保障XX天计算。肉按人日均XXkg,可保障XX天计算。鱼按人日均XXkg,可保障XX天计算。蛋按人日均XXkg,可保障XX天计算。禽按人日均XXkg,可保障XX天计算。蔬菜按人日均XXkg,可保障XX天计算。水果按人日均XXkg,可保障XX天计算。食用油按人日均XXkg,可保障XX天计算。食盐按人日均XXkg,可保障XX天计算。奶按人日均XXL,可保障XX天计算。饮用水按人日均XXL,可保障XX天计算。"
);

const valueHtml3 = ref(
  "&nbsp;&nbsp;保障任务：主要负责救灾物资采购、存储、调配、发放，以及经费筹措、使用管理。<br/>&nbsp;&nbsp;保障方法：采取以市政府储备为主，政府储备与企业代储、生产能力储备和家庭储备相结合的方法保障，建立市、县（区）两级储备。<br/>&nbsp;&nbsp;物资经费来源：主要由本级政府保障，不足部分申请上级保障。<br/>&nbsp;&nbsp;战储保障人口规模：按城市人口XX%计算。某某市人口XX万、某某区人口XX万、某某区人口XX万、龙某某区人口XX万、某某区人口XX万、某某区人口XX万、某某县人口XX万、某某县人口XX万、某某县人口XX万、某某县人口XX万。<br/>&nbsp;&nbsp;单件物品战储计算标准：按帐篷XX人1顶,净水器XX人1个,简易厕所XX人1个,沐浴房XX人1个,应急灯XX人1个,应急食品1人XX份,饮用水1人XX瓶,折叠床、棉被、毛毯、毛巾被、蚊帐、凉席、棉衣、秋衣等1人XX件。"
);

const valueHtml4 = ref(
  "&nbsp;&nbsp;保障任务：主要负责工程物资采购、存储、调配、发放，以及经费筹措、使用管理。<br/>&nbsp;&nbsp;保障方法：平战转换工作使用消耗的工程物资，由各工程建设单位或工程使用管理单位自行保障；战储采取以政府储备为主，政府储备与企业代储、生产能力储备相结合的方式保障，建立市、县（区）两级储备。<br/>&nbsp;&nbsp;物资经费来源：主要由本级保障，不足部分申请上级保障。"
);
const valueHtml5 = ref(
  "&nbsp;&nbsp;(1)保障任务：①情报获取，搜集处理上级提供的战略情报、战场态势、实时空情、敌特活动等情报信息，以及本级侦搜的对空观察、低空预警雷达探测、重要目标警戒等情报信息；②预警报知，根据实际情况依令发放早期预警、空袭预警、解除空袭警报；③信息节点，各级各类指挥所组织开设；④通信网络，组织光纤、短波、卫星、集群、北斗导航等通信网的网络联接等；⑤指控系统，组织各级指挥所指控系统的设备调配、软件部署，以及系统备份等；⑥信息防护，组织数据、网络、平台安全防护和容灾备份等。<br/>&nbsp;&nbsp;(2)情报获取保障要点：市、县（区）人防指挥所通过人防光缆专网接入军队空袭信息网，安装空情处理软件，接收空情信息。人防光缆专网的路由建设、情报信息接收处理终端及空情处理软件均由上级保障。<br/>&nbsp;&nbsp;(3)预警报知保障要点：市、县（区）两级空情预警警报的覆盖率应达到XX%，警报器的安装以及利用广播、电视、互联网、移动通信、公众媒体发布警报信息手段的建设均由本级保障。<br/>&nbsp;&nbsp;(4)信息节点保障要点：信息节点保障要点：市、县（区）两级人防指挥所均应开设信息节点，其中，路由建设由上级保障，各级信息节点的设备采购由本级保障。<br/>&nbsp;&nbsp;(5)通信网络保障要点：市、县（区）两级人防指挥所人防光缆专网的路由建设由上级保障，光缆专网的终端设备、150瓦短波电台、超短波数字集群等均由本级保障。<br/>&nbsp;&nbsp;(6)指控系统保障要点：市、县（区）两级人防指挥所均应安装指控系统，硬件由本级保障，软件由省办统一保障。<br/>&nbsp;&nbsp;(7)信息防护保障要点：市、县（区）两级人防指挥均应安装防火墙、防毒墙、入侵检测设备、安全审计设备、保密机、屏蔽室、容灾备份、杀毒软件、防护软件等设备。上述软件、设备，按照省办统一部署，由本级保障。"
);

const valueHtml6 = ref(
  "&nbsp;&nbsp;保障任务：有XX个人防指挥所（含地面指挥中心），XX个人防工程，XX个重要目标单位，上述目标附近应建立卫生防疫点（临时、机动），储备卫生防疫器材、药品，完善卫生防疫信息网和卫生防疫机制。<br/>&nbsp;&nbsp;卫生防疫点开设：市、县（区）两级依托现有卫生防疫机构展开平战转换，在人防指挥工程、人员防护工程、重要目标单位，开设临时卫生防疫所，也可开设机动卫生防疫所，采取流动巡查方式保障。<br/>&nbsp;&nbsp;卫生防疫信息网：按照市、县（区）、街道（乡镇）至人防指挥工程、人防工程、重要目标单位全覆盖标准完善信息网络建设，重点保障重要目标及附近地区的信息畅通，必要时实施24小时保障值守。<br/>&nbsp;&nbsp;卫生防疫专业队扩编：按本节“专业力量扩编保障要点”、“装备器材保障要点”中相关内容执行。<br/>&nbsp;&nbsp;卫生防疫器材、药品储备：按照战时卫生防疫器材、药品储备目录，根据实际需要分级、分区储备，采购器材、药品的经费按照本级保障为主，不足部分申请上级调拨补充。"
);

const saveProgramme = () => {
  ElMessageBox.confirm(`确定要保存吗?`, "警告", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
    customClass: "message-box",
  }).then(() => {
    addOrUpdatePzzh({
      m: "相关保障",
      data: [
        {
          k: "专业力量扩编保障要点",
          v: valueHtml.value,
        },
        {
          k: "装备器材保障要点",
          v: valueHtml1.value,
        },
        {
          k: "生活物资经费保障",
          v: valueHtml2.value,
        },
        {
          k: "救灾物资经费保障",
          v: valueHtml3.value,
        },
        {
          k: "工程物资经费保障",
          v: valueHtml4.value,
        },
        {
          k: "信息通信保障要点",
          v: valueHtml5.value,
        },
        {
          k: "卫生防疫保障要点",
          v: valueHtml6.value,
        },
      ],
    })
      .then(() => {
        ElMessage.success("操作成功");
      })
      .catch(() => {});
  });
};

// 生活物资战储需求清单
const shwzZcList = ref([]);
const getShwzZcData = () => {
  return postTableData({
    docType: "spaceToWar",
    method: "shenghuowuzizhanchuqingkuang",
  }).then((res) => {
    if (res.code === 200) {
      shwzZcList.value = res?.data || [];
    }
  });
};
// 救灾物资战储清单
const jzwzList = ref([]);
const getJzwzData = () => {
  return postTableData({
    docType: "spaceToWar",
    method: "jiuzaiwuzizhanchuList",
  }).then((res) => {
    if (res.code === 200) {
      jzwzList.value = res?.data || [];
    }
  });
};

onMounted(async () => {
  await initHtml();
  // await getShwzZcData();
  // await getJzwzData();
});
onBeforeUnmount(() => {
  const editor = editorRef.value;
  const editor1 = editorRef1.value;
  const editor2 = editorRef2.value;
  const editor3 = editorRef3.value;
  const editor4 = editorRef4.value;
  const editor5 = editorRef5.value;
  const editor6 = editorRef6.value;

  if (!editor) return;
  if (!editor1) return;
  if (!editor2) return;
  if (!editor3) return;
  if (!editor4) return;
  if (!editor5) return;
  if (!editor6) return;

  editor.destroy();
  editor1.destroy();
  editor2.destroy();
  editor3.destroy();
  editor4.destroy();
  editor5.destroy();
  editor6.destroy();
});

// 表头单元格样式
const headerCellStyle = () => {
  return {
    backgroundColor: "#f5f7fa",
    color: "rgba(0,0,0,0.85)",
    fontSize: "14px",
    height: "54px",
  };
};
// 单元格样式
const cellStyle = () => {
  return {
    color: "rgba(0,0,0,0.65)",
    fontSize: "14px",
    lineHeight: "22px",
  };
};

const tableData = ref([
  {
    c1: 1,
    c2: "个人防护用品",
    c3: "xx",
  },
  {
    c1: 2,
    c2: "个人防护用品",
    c3: "xx",
  },
  {
    c1: 3,
    c2: "个人防护用品",
    c3: "xx",
  },
]);
</script>
<template>
  <div class="">
    <div class="top-15">
      主要明确专业力量扩编、装备器材、物资经费、信息通信、卫生防疫等5个方面的保障要点。
    </div>
    <FirstTitle name="专业力量扩编保障要点" class="top-15" />
    <div style="border: 1px solid #ccc" class="top-15">
      <Toolbar
        style="border-bottom: 1px solid #ccc"
        :editor="editorRef"
        :defaultConfig="toolbarConfig"
        :mode="mode"
      />
      <Editor
        style="height: 500px; overflow-y: hidden"
        v-model="valueHtml"
        :defaultConfig="editorConfig"
        :mode="mode"
        @onCreated="handleCreated"
      />
    </div>

    <FirstTitle name="装备器材保障要点" class="top-15" />
    <div style="border: 1px solid #ccc" class="top-15">
      <Toolbar
        style="border-bottom: 1px solid #ccc"
        :editor="editorRef1"
        :defaultConfig="toolbarConfig1"
        :mode="mode1"
      />
      <Editor
        style="height: 500px; overflow-y: hidden"
        v-model="valueHtml1"
        :defaultConfig="editorConfig"
        :mode="mode1"
        @onCreated="handleCreated1"
      />
    </div>
    <div class="top-15 text-center">
      {{ city }}抢险抢修（电力）专业队装备器材保障参照表
    </div>
    <el-table
      id="table"
      :data="dlList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="分类" />
      <el-table-column prop="c3" label="装备器材名称" />
    </el-table>

    <div class="top-15 text-center">
      {{ city }}抢险抢修（供水）专业队装备器材保障参照表
    </div>
    <el-table
      id="table"
      :data="gsList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="分类" />
      <el-table-column prop="c3" label="装备器材名称" />
    </el-table>

    <div class="top-15 text-center">
      {{ city }}抢险抢修（燃气）专业队装备器材保障参照表
    </div>
    <el-table
      id="table"
      :data="rqList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="分类" />
      <el-table-column prop="c3" label="装备器材名称" />
    </el-table>

    <div class="top-15 text-center">
      {{ city }}抢险抢修（道桥）专业队装备器材保障参照表
    </div>
    <el-table
      id="table"
      :data="dqList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="分类" />
      <el-table-column prop="c3" label="装备器材名称" />
    </el-table>

    <div class="top-15 text-center">
      {{ city }}抢险抢修（建筑）专业队装备器材保障参照表
    </div>
    <el-table
      id="table"
      :data="jzList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="分类" />
      <el-table-column prop="c3" label="装备器材名称" />
    </el-table>

    <div class="top-15 text-center">
      {{ city }}抢险抢修（供热）专业队装备器材保障参照表
    </div>
    <el-table
      id="table"
      :data="grList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="分类" />
      <el-table-column prop="c3" label="装备器材名称" />
    </el-table>

    <div class="top-15 text-center">
      {{ city }}卫生救护专业队装备器材保障参照表
    </div>
    <el-table
      id="table"
      :data="jhList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="分类" />
      <el-table-column prop="c3" label="装备器材名称" />
    </el-table>

    <div class="top-15 text-center">
      {{ city }}消防救援专业队装备器材保障参照表
    </div>
    <el-table
      id="table"
      :data="jyList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="分类" />
      <el-table-column prop="c3" label="装备器材名称" />
    </el-table>

    <div class="top-15 text-center">{{ city }}通信专业队装备器材保障参照表</div>
    <el-table
      id="table"
      :data="txList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="分类" />
      <el-table-column prop="c3" label="装备器材名称" />
    </el-table>

    <div class="top-15 text-center">
      {{ city }}交通运输专业队装备器材保障参照表
    </div>
    <el-table
      id="table"
      :data="ysList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="分类" />
      <el-table-column prop="c3" label="装备器材名称" />
    </el-table>

    <div class="top-15 text-center">
      {{ city }}信息防护专业队装备器材保障参照表
    </div>
    <el-table
      id="table"
      :data="xxList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="分类" />
      <el-table-column prop="c3" label="装备器材名称" />
    </el-table>

    <div class="top-15 text-center">
      {{ city }}心理防护专业队装备器材保障参照表
    </div>
    <el-table
      id="table"
      :data="xlList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="分类" />
      <el-table-column prop="c3" label="装备器材名称" />
    </el-table>

    <div class="top-15 text-center">
      {{ city }}核化洗消、检测专业队装备器材保障参照表
    </div>
    <el-table
      id="table"
      :data="hhList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="分类" />
      <el-table-column prop="c3" label="装备器材名称" />
    </el-table>

    <div class="top-15 text-center">
      {{ city }}伪装设障防护专业队装备器材保障参照表
    </div>
    <el-table
      id="table"
      :data="wzList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="分类" />
      <el-table-column prop="c3" label="装备器材名称" />
    </el-table>

    <FirstTitle name="物资经费保障要点" class="top-15" />
    <div class="top-15">(1)生活物资经费保障</div>
    <div style="border: 1px solid #ccc" class="top-15">
      <Toolbar
        style="border-bottom: 1px solid #ccc"
        :editor="editorRef2"
        :defaultConfig="toolbarConfig2"
        :mode="mode2"
      />
      <Editor
        style="height: 500px; overflow-y: hidden"
        v-model="valueHtml2"
        :defaultConfig="editorConfig"
        :mode="mode2"
        @onCreated="handleCreated2"
      />
    </div>
    <div class="top-15">救灾物资经费保障</div>
    <div style="border: 1px solid #ccc" class="top-15">
      <Toolbar
        style="border-bottom: 1px solid #ccc"
        :editor="editorRef3"
        :defaultConfig="toolbarConfig3"
        :mode="mode3"
      />
      <Editor
        style="height: 500px; overflow-y: hidden"
        v-model="valueHtml3"
        :defaultConfig="editorConfig"
        :mode="mode3"
        @onCreated="handleCreated3"
      />
    </div>
    <div class="top-15">(3)工程物资经费保障</div>
    <div style="border: 1px solid #ccc" class="top-15">
      <Toolbar
        style="border-bottom: 1px solid #ccc"
        :editor="editorRef4"
        :defaultConfig="toolbarConfig4"
        :mode="mode4"
      />
      <Editor
        style="height: 500px; overflow-y: hidden"
        v-model="valueHtml4"
        :defaultConfig="editorConfig"
        :mode="mode4"
        @onCreated="handleCreated4"
      />
    </div>
    <div class="top-15">工程物资战储种类参考清单：</div>
    <div class="top-15 text-center">{{ city }}工程物资战储种类参考清单</div>
    <el-table
      id="table"
      :data="gcList"
      class="top-15"
      style="width: 100%"
      :header-cell-style="headerCellStyle"
      :cell-style="cellStyle"
      border
    >
      <el-table-column prop="c1" label="序号" />
      <el-table-column prop="c2" label="名称" />
      <el-table-column prop="c3" label="序号" />
      <el-table-column prop="c4" label="名称" />
    </el-table>

    <FirstTitle name="信息通信保障要点" class="top-15" />
    <div style="border: 1px solid #ccc" class="top-15">
      <Toolbar
        style="border-bottom: 1px solid #ccc"
        :editor="editorRef5"
        :defaultConfig="toolbarConfig5"
        :mode="mode5"
      />
      <Editor
        style="height: 500px; overflow-y: hidden"
        v-model="valueHtml5"
        :defaultConfig="editorConfig"
        :mode="mode5"
        @onCreated="handleCreated5"
      />
    </div>

    <FirstTitle name="卫生防疫保障要点" class="top-15" />
    <div style="border: 1px solid #ccc" class="top-15">
      <Toolbar
        style="border-bottom: 1px solid #ccc"
        :editor="editorRef6"
        :defaultConfig="toolbarConfig6"
        :mode="mode6"
      />
      <Editor
        style="height: 500px; overflow-y: hidden"
        v-model="valueHtml6"
        :defaultConfig="editorConfig"
        :mode="mode6"
        @onCreated="handleCreated6"
      />
    </div>

    <div class="flex-justify-end top-20">
      <el-button type="primary" class="save-btn" @click="saveProgramme"
        >保存</el-button
      >
    </div>
  </div>
</template>
<style scoped lang="scss"></style>